<template>
	<view class="basic-info">
		<!-- 标题 -->
		<view class="title">基本资料</view>
		<u--form labelPosition="left" :model="formData" labelWidth='80' :rules="rules" ref="uForm">
			<u-form-item label="姓名" prop="name" borderBottom ref="item1">
				<u--input border='surround' v-model="formData.name" ></u--input>
			</u-form-item>
			<u-form-item label="手机号码" prop="phone" borderBottom ref="item1">
				<u--input border='surround' v-model="formData.phone" ></u--input>
			</u-form-item>
			<u-form-item label="身份证号" prop="idCard" borderBottom ref="item1">
				<u--input border='surround' v-model="formData.idCard" ></u--input>
			</u-form-item>
			<u-form-item label="期望岗位" prop="expectPosition" borderBottom ref="item1">
				<u--input border='surround' v-model="formData.expectPosition" ></u--input>
			</u-form-item>
			<u-form-item label="期望薪资" prop="expectSalary" borderBottom ref="item1">
				<u--input border='surround' v-model="formData.expectSalary" ></u--input>
			</u-form-item>
			<u-form-item label="期望岗位" prop="expectPosition" borderBottom ref="item1">
				<u--input border='surround' v-model="formData.expectPosition" ></u--input>
			</u-form-item>
			<u-form-item label="备注" prop="remark" borderBottom ref="item1">
				<u--input border='surround' v-model="formData.remark" ></u--input>
			</u-form-item>
		</u--form>
	
		<u-button  type="primary" formType="submit" @click="handleSubmit">
			确认
		</u-button>
	
	</view>
</template>

<script>
	export default {
		data() {
			return {
				model1: {},
				rules: {},
				// 表单数据
				formData: {
					name: '',
					phone: '',
					idCard: '',
					expectPosition: '',
					expectSalary: '',
					remark: ''
				}
			};
		},
		methods: {
			// 提交表单
			handleSubmit() {
				// 阻止默认提交行为
				

				// 简单校验（可根据需求扩展）
				if (!this.formData.name) {
					uni.showToast({
						title: '请输入姓名',
						icon: 'none'
					});
					return;
				}
				if (!this.formData.phone || this.formData.phone.length !== 11) {
					uni.showToast({
						title: '请输入正确的手机号码',
						icon: 'none'
					});
					return;
				}
				if (!this.formData.idCard || this.formData.idCard.length !== 18) {
					uni.showToast({
						title: '请输入正确的身份证号',
						icon: 'none'
					});
					return;
				}
				if (!this.formData.expectPosition) {
					uni.showToast({
						title: '请输入期望岗位',
						icon: 'none'
					});
					return;
				}
				if (!this.formData.expectSalary) {
					uni.showToast({
						title: '请输入期望薪资',
						icon: 'none'
					});
					return;
				}

				// 校验通过，提交数据（可对接接口）
				console.log('表单数据：', this.formData);
				uni.showToast({
					title: '提交成功'
				});

				// （可选）提交到后端接口
				// uni.request({
				//   url: 'https://your-api.com/submit',
				//   method: 'POST',
				//   data: this.formData,
				//   success: (res) => {
				//     uni.showToast({ title: '提交成功' });
				//   },
				//   fail: (err) => {
				//     uni.showToast({ title: '提交失败', icon: 'none' });
				//   }
				// });
			}
		}
	};
</script>

<style scoped>
	/* 页面容器 */
	.basic-info {
		padding: 16px;
		background-color: #fff;
	}

	/* 标题样式 */
	.title {
		font-size: 16px;
		font-weight: bold;
		margin-bottom: 16px;
	}

	/* 表单项样式 */
	.form-item {
		display: flex;
		flex-direction: column;
		margin-bottom: 12px;
	}

	/* 标签样式 */
	.label {
		font-size: 14px;
		color: #333;
		margin-bottom: 4px;
	}

	/* 输入框样式 */
	input,
	textarea {
		padding: 10px;
		border: 1px solid #ddd;
		border-radius: 4px;
		font-size: 14px;
	}

	/* 确认按钮样式 */
	.confirm-btn {
		width: 100%;
		background-color: #007aff;
		color: #fff;
		font-size: 16px;
		padding: 12px 0;
		border-radius: 8px;
	}
</style>